﻿@namespace MudBlazor.Docs.Examples

<MudPaper Width="250px" Class="py-3" Elevation="0">
    <MudNavMenu>
        <MudText Typo="Typo.h6" Class="px-4">My Application</MudText>
        <MudText Typo="Typo.body2" Class="px-4 mud-text-secondary">Secondary Text</MudText>
        <MudDivider Class="my-2" />
        <MudNavLink Href="/dashboard">Dashboard</MudNavLink>
        <MudNavLink Href="/servers">Servers</MudNavLink>
        <MudNavLink Href="/billing" Disabled="true">Billing</MudNavLink>
        <MudNavGroup Title="Settings" HeaderClass="settings-error" Expanded="true">
            <TitleContent>
                <MudBadge Icon="@Icons.Material.Filled.ErrorOutline" 
                          Color="Color.Error" 
                          Origin="@(RightToLeft ? Origin.CenterLeft : Origin.CenterRight)" 
                          BadgeClass="mx-2">
                    Settings
                </MudBadge>
            </TitleContent>
            <ChildContent>
                <MudNavLink Href="/users">Users</MudNavLink>
                <MudNavLink Href="/security">
                    <MudBadge Content="3" 
                              Color="Color.Error" 
                              Origin="@(RightToLeft ? Origin.CenterLeft : Origin.CenterRight)" 
                              BadgeClass="mx-2">
                        Security
                    </MudBadge>
                </MudNavLink>
            </ChildContent>
        </MudNavGroup>
        <MudNavLink Href="/about">About</MudNavLink>
    </MudNavMenu>
</MudPaper>

@code {
    [CascadingParameter(Name = "RightToLeft")] public bool RightToLeft { get; set; }
}

<style>    
    .settings-error {
        color: red;
    }
</style>
